// 社交账号登录、注册组件
import React from 'react'
import { Box, Flex, Text, Image } from '@chakra-ui/core'
import logo1 from "../images/logo1.png"
import logo2 from "../images/logo2.png"
import logo3 from "../images/logo3.png"

export default function Login (props) {
    // 获取当前选项类型
    const {type} = props || 'signIn'
    return <Box mt="50px">
        <Flex align="center" justify="center" mb="10px">
            <Text fontSize="12px" color="#b5b5b5">—————</Text>
            <Text fontSize="12px" color="#b5b5b5" mx="25px">
                {/* 根据选项的不同显示不同的文字 */}
                {type === 'signIn' ? "社交帐号登录" : "社交帐号直接注册"}
            </Text>
            <Text fontSize="12px" color="#b5b5b5">—————</Text>
        </Flex>
        <Flex align="center" justify="center">
            {/* 如果当前选项是注册则不显示微博注册图标 */}
            <Image w="35px" mx="15px" src={logo1} display={type === 'signIn' ? 'block' : 'none'}></Image>
            <Image w="35px" mx="15px" src={logo2}></Image>
            <Image w="35px" mx="15px" src={logo3}></Image>
        </Flex>
    </Box>
}